﻿@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600);
html { }
body { font-size: 1em; font-family: 'open sans'; padding: 0px; margin: 0px; font-weight: 200; }
h1 { font-weight: 200; padding: 2px; margin: 0px; }
h2 { font-weight: 200; padding: 2px; margin: 0px; }
p { font-weight: 200; padding: 0px; margin: 0px; line-height: normal; padding: 4px; font-size: 1em; color: #444; }
a { text-decoration: none; color: RoyalBlue; font-weight: 700; cursor: pointer; }
a:hover { text-decoration: underline; color: Green; }
.active-tab { color: DarkRed; font-size: 1.5em; border-bottom: 2px solid DarkRed; }
.normal-tab { color: Grey; font-size: 1em; }
.alt-grid-row { background-color: #eee; }
#page-root { min-width: 1024px; height: 100%; width: 100%; }
#page-content { position: relative; }
#top-bar { height: 40px; background-color: #333; border-bottom: 1px solid #eee; color: #eee; }
#left-panel { width: 15%; min-width: 200px; float: left; min-height: 400px; }
#left-panel > div { padding: 10px; }
#right-panel { width: 80%; min-width: 804px; float: left; min-height: 400px; }
#right-panel > div { padding: 10px; border: 1px solid #eee; height: 100%; }
#footer { height: 30px; background-color: #555; width: 100%; position: fixed; bottom: 0px; color: #eee; }
#photo-panel { width: 150px; height: 200px; }
#menu-bar ul { list-style-type: none; padding: 2px; margin: 2px; }
#menu-bar ul li { display: inline; cursor: pointer; margin-right: 10px; }
#menu-bar ul li:hover { color: DarkRed; border-bottom: 2px solid DarkRed; }
#percentile-panel, #rank-panel { position: relative; height: 80px; width: 96px; border: 1px solid DarkRed; text-align: left; margin: 2px; }
#percentile-panel h1, #rank-panel h1 { padding: 2px; font-size: 2em; color: DarkRed; }
#percentile-panel div, #rank-panel div { position: absolute; background-color: DarkRed; color: #eee; bottom: 0px; width: 96px; height: 24px; }
#grid-panel { overflow-y: auto; min-height: 300px; }
#grid-footer { height: 18px; border-top: 1px solid DarkRed; border-bottom: 1px solid DarkRed; padding: 4px; color: DarkRed; text-align: right; font-weight: 700; font-size: 0.8em; }
#exams-table { width: 100%; border: none; padding: 0px; margin: 0px; }
#exams-table thead { height: 20px; padding: 0px; color: DarkRed; margin: 0px; text-align: left; }
#exams-table thead th { border-bottom: 2px solid DarkRed; }
#exams-table td { padding: 4px; margin: 0px; vertical-align: top; border: 1px solid #eee; font-size: 0.9em; }
.details-panel { position: relative; background-color: Transparent; margin: 10px; margin-bottom: 20px; border: 1px solid #ccc; overflow: hidden; }
.details-panel h2 { font-weight: 700; padding-left: 10px; color: #333; border-bottom: 2px solid #eee; }
.result-bar { height: 40px; width: 500px; color: #eee; }
.result-bar span { font-weight: 700; cursor: pointer; }
.question-panel { vertical-align: top; width: 200px; }
.question-panel p { color: DarkBlue; font-size: 0.8em; font-weight: 700; }
.explataion-panel { vertical-align: top; width: 250px; }
.explataion-panel p { color: DarkRed; font-size: 0.8em; font-weight: 700; }
.details-footer { height: 30px; background-color: Brown; position: absolute; bottom: 0px; width: 100%; }
.details-footer p { color: #eee; font-size: 1em; font-weight: 700; float: left; }
.details-footer a { float: right; margin-top: 2px; margin-left: 6px; margin-right: 6px; color: #eee; }
.links-panel { vertical-align: top; background-color: #eee; height: 100%; }
